import React, { Suspense } from 'react'
import {
  BrowserRouter,
  Routes,
  Route,
  Navigate
} from "react-router-dom";
import routes from "./routerConfig";
import {ROUTERTYPE} from "../types/router.d"
function routerViews() {
  const renderRouter = (routes:ROUTERTYPE[])=>{
     return routes.map((item,index)=>{
       return <Route key={index} path={item.path} element={item.to?<Navigate to={item.to}/>:<item.component/>}>
         {
           item.children&&renderRouter(item.children)
         }
       </Route>
     })
  }
  return (
    <Suspense fallback={<div>正在加载中。。。。</div>}>
      <BrowserRouter>
        <Routes>
          {
            renderRouter(routes)
          }
        </Routes>
      </BrowserRouter>
    </Suspense>
  )
}

export default routerViews
